import React, {Component} from 'react';
import {Col, Row, Spin} from 'antd';
import '../css/register.css';
import {Back} from '../components/EditComponent';

import {config} from "../config";
import {order, wechat} from "../value";
import app from '../AppMethod';

class DeliveryOrderDetail extends Component {
    constructor(props) {
        super(props);
        this.state = {
            data: {},
            loading: false
        }
    };

    render() {
        let {
            output_num, output_follow_name, output_follow_phone, output_receive_name,
            output_receive_mobile, output_receive_address,
            output_logistics_type, output_stop_position, output_customer_car, car_logistics_name, car_logistics_phone
        } = this.state.data;
        let type = Number(output_logistics_type);
        return (
            <div className="orderListContainer">
                <div>
                    <Back title="订单详情" back="true" click={() => this.handleBack()}/>
                </div>
                <div className="orderListContent">
                    <Spin spinning={this.state.loading}>
                        <Row className="DeliveryOrderDetail">
                            <Row className="orderItem">
                                <Row style={{height: '30px', lineHeight: '30px'}}>
                                    <Col className="orderItemNumber" xs={16} md={8} lg={6}>订单号：{output_num}</Col>
                                </Row>
                                <Row style={{height: '30px', lineHeight: '30px'}}>
                                    <Col className="orderPerson" xs={11} md={8} lg={6}>跟单人：{output_follow_name}</Col>
                                    <Col className="orderPerson" xs={13} md={8} lg={6}>联系电话：{output_follow_phone}</Col>
                                </Row>
                                {
                                    type == 1 ? <Row style={{height: '30px', lineHeight: '30px'}}>
                                        <Col className="orderPerson" xs={12} md={8}
                                             lg={6}>客户车牌号：{output_customer_car}</Col>
                                        <Col className="orderPerson" xs={12} md={8}
                                             lg={6}>停靠位置：{output_stop_position}</Col>
                                    </Row> : ''
                                }
                                {
                                    type == 2 ?

                                        <Row style={{height: '30px', lineHeight: '30px'}}>
                                            <Col className="orderPerson" xs={24} md={8}
                                                 lg={6}>托运公司：{car_logistics_name}</Col>
                                            <Col className="orderPerson" xs={24} md={8}
                                                 lg={6}>托运电话：{car_logistics_phone}</Col>
                                        </Row>
                                        : ''
                                }
                            </Row>
                        </Row>
                        <Row className="DeliveryOrderDetail">
                            <Row className="orderItem" style={{height: '30px', lineHeight: '30px'}}>
                                <Col className="orderPerson" xs={24} md={8} lg={6}>收货人：{output_receive_name}</Col>
                                <Col className="orderPerson" xs={24} md={8} lg={6}>联系方式：{output_receive_mobile}</Col>
                                <Col className="orderPerson" xs={24} md={16} lg={6}>地址：{output_receive_address}</Col>
                            </Row>
                        </Row>

                    </Spin>
                </div>
            </div>
        )
    };

    componentDidMount() {
        this.handleGetOrderDetail();
    };

    componentWillUnmount() {
        this.setState = (count, callback) => {
            return;
        }
    }

    /**
     * 处理返回事件
     */
    handleBack() {
        this.props.history.goBack();
    }

    /**
     * 根据订单id查询订单详情
     * @returns {Promise.<void>}
     */
    async handleGetOrderDetail() {
        this.setState({loading: true});
        try {
            let output_num = this.props.match.params.id;
            let result = await app.post(order.EMPLOYEE_SEARCHOUTPUT, {output_num: output_num});
            if (result.code === 1) {
                let data = result.data;
                this.setState({data, loading: false});
            } else {
                app.alert(result.msg, 'error', 3);
                this.setState({data: {}, loading: false});
            }
        } catch (e) {
            app.alert(e.msg, 'error', 3);
            this.setState({data: {}, loading: false});
        }
    };
}

export default DeliveryOrderDetail;